import React from "react";
import ReactDom from "react-dom"
function UserGreet() {
    return (
        <div>
            <h1>欢迎访问</h1>
        </div>
    )
}

class UserLogin extends React.Component {
    constructor(props) {
        super(props);
        this.login = this.login.bind(this)
    }
    login(e) {
        e.preventDefault()
        this.props.login()
    }
    render() {
        return (
            <div>
                <h1>请先<a href='' onClick={this.login}>登陆</a></h1>
            </div>
        )
    }
}

class Parent extends React.Component {
    constructor() {
        super();
        this.state = {
            isLogin: false
        }
        this.login = this.login.bind(this)
    }

    login() {
        this.setState({
            isLogin: true
        })
    }

    render() {
        let el = this.state.isLogin ? <UserGreet/> : <UserLogin login={this.login}/>
        return (
            <div>
                {el}
            </div>
        )
    }
}

ReactDom.render(
    <Parent/>,
    document.querySelector('#root')
)